{% extends 'web/base.html' %}
{% load staticfiles %}
{% block base_title %} 提交 {% endblock %}

<!--{% block manifest %}appcache/tijiao.appcache{% endblock %}-->
{% block base_run %}tijiao{% endblock %}

{% block base_body %}
{% verbatim %}
<div class="open_down scroll all_bg" id="tijiao">
    <div v-if="loading" ></div>
    <div v-else class="load_fix">
        <div class="zuan_center" >
            <div class="ui active centered inline loader red" style="top: 50%;transform: scale(.6)"></div>
        </div>
    </div>

    <div class="news_table">
        <div class="news_row">
            <div class="news_img1 news_td"><div><img :src="'http://www.zgtxcj.com/'+zuanx.d_image" alt=""></div></div>
            <div class="new_title">
                <div class="news_content news_td" style="position: absolute">
                    <p class="con_name">{{ zuanx.d_name }}专享</p>
                </div>
                <div class="news_btns news_td" style="width: 4.2rem;font-size: .4rem;float: right;position: absolute">{{ zuanx.d_editprice }}元/{{ zuanx.d_edition }}个月</div>
            </div>
            <div class="new_title" v-if="zengCh.length!=0">
                <div class="new_tl">赠送(选一) :</div>
                <div class="new_tr">
                    <div v-for="zeng in zengCh">
                        <div class="new_tro">{{ zeng.product.p_name }}</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--<ul class="xq_js">-->
    <!--<li>本策略事宜10万投资者</li>-->
    <!--<li>本策略事宜10万投资者</li>-->

    <!--</ul>-->
    <div class="white_zuan">
        <span>{{ zuanx.d_name }}特权</span>
        <ul class="clearfix" style="padding-bottom: .9rem">
            <li v-for="chan in zuanCh">
                <img :src="'http://www.zgtxcj.com/'+chan.product.p_image" alt="">
                {{ chan.product.p_name }}
            </li>
        </ul>
    </div>
    <div class="re_check" @click="putImg()">
      <div class="re_window" style="left:-.5rem"><img :src="duihao" style="display: none;position:absolute;top: -.1rem;left: -.1rem;" /></div>
      已阅读并同意
        <a :href="'/xz/login/?phone='+phone+'&pass='+pass+'&redir=tishi'">《风险提示》</a>
      <a :href="'/xz/login/?phone='+phone+'&pass='+pass+'&redir=xieyi'">《用户协议》</a>
      <a :href="'/xz/login/?phone='+phone+'&pass='+pass+'&redir=fangfan'">《风险防控措施》</a>
    </div>
    <!-- <a :href="'/xz/login/?phone='+phone+'&pass='+pass+'&redir=pay'"> -->
    <button @click="toPay()" class="click_txt down_btn" >开 通</button>
    <!-- </a> -->
</div>
{% endverbatim %}
{% endblock %}

{% block base_script %}
    var tijiao = new Vue({
        el: '#tijiao',
        data:{
            myUrl:'http://api.zgtxcj.com/txcjapi/',
            did:localStorage.getItem('did'),
            zuanx:[],
            zuanCh:[],
            zengCh:[],
            loading: false,
            phone: localStorage.getItem('phone'),
            pass: localStorage.getItem('pass'),
            duihao: "{% static 'img/right.png' %}",
        },
        methods: {
            getXiang:function () {
                var self = this;
                reqwest({
                    url: self.myUrl + 'indiamonds/?tag=diamonds&id=' + self.did,
                    method: 'get',
                    type: 'json',
                    success: function (resp) {
                        if (resp['d_image'].indexOf('|') != -1) {
                            resp['d_image'] = resp['d_image'].split('|')[0]
                        }
                        self.zuanx = resp;
                        self.getChan();
                    }
                })
            },
            getChan:function () {
                var self = this;
                reqwest({
                    url: self.myUrl + 'indiamonds/?tag=diapro&id=' + self.did,
                    method: 'get',
                    type: 'json',
                    success: function (resp) {
                        for (var t in resp) {
                            if (resp[t]['dp_tag'] == 1) {
                                resp[t]['product']['p_image'] = resp[t]['product']['p_image'].split('|')[0];
                                self.zuanCh.push(resp[t]);
                            }
                            if (resp[t]['dp_tag'] == 3) {
                                self.zengCh.push(resp[t])
                            }
                        }
                        self.loading=true;
                    }
                })
            },
            putImg:function () {
              var display = $('.re_check img').css('display')
              if (display === 'none') {
                $('.re_check img').show()
              } else {
                $('.re_check img').hide()
              }
            },
            toPay: function () {
              var self = this;
              var display = $('.re_check img').css('display');
              if (display == 'none') {
                alert('请点击确认风险提示');
              } else {
                location.href = '/xz/login/?phone=' + self.phone + '&pass=' + self.pass + '&redir=pay'
              }
            },
            run:function () {
                this.getXiang()
            }
        },
    })
{% endblock %}
